<%--
  Created by IntelliJ IDEA.
  User: gby0564
  Date: 2022/4/11
  Time: 15:39
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>首页</title>

</head>

<body>




<input type="number" placeholder="请输入手机号" id="tel" />
<input type="password" placeholder="请输入密码" id="pas" />
<button type="button" onclick="enter()">登录</button>
<div><span>没有账号?</span><span  style="color: #0055ff;" onclick="skipregister()">点击注册</span></div>
</body>



<script type="text/javascript">
    // 跳转到注册页面
    function skipregister(){
        window.location.href = "register.jsp"
    }
    // 登录事件
    function enter(){
        // 获取用户输入的账号
        let tel = document.getElementById("tel").value;
        console.log(tel);
        // 获取用户输入的密码
        let pas = document.getElementById("pas").value;
        console.log(pas);
        // 判断本地是否有数据 如果没有数据直接提示未注册
        if(localStorage.length == 0){
            alert("您还未注册")
        }else{
            let teldata = [] // 创建一个数组   用于存储本地所有已存储的手机号
            let pasdata = [] // 创建一个数组   用于存储本地所有已存储的密码
            let iddata = [] // 创建一个数组   用于存储本地所有已存储的id
            // 循环判断本地是否有次手机号
            for (let i = 0; i < localStorage.length; i++) {
                // 获取所有的key钥匙
                let key = localStorage.key(i)
                console.log(key);
                // 通过key拿到对应的数据进行判断
                let keydata = localStorage.getItem(key); // 拿到对应数据  只不过这时候是字符串
                let keyinfo = JSON.parse(keydata) // 将字符串转化为对象的形式
                console.log(keyinfo);
                // 向数组中添加数据   我们通过下标i的方式添加   这样手机号我密码是对应的   不能通过push添加！！！  不然手机号和密码是乱的
                teldata[i] = keyinfo.tel
                pasdata[i] = keyinfo.pas
                iddata[i] = keyinfo.id
            }
            console.log(teldata);
            console.log(pasdata);
            console.log(iddata);
            // 判断此手机号是否注册
            if(teldata.indexOf(tel) < 0){  // indexof方法用户查看一个数组中是否有某个值，如果没有它会返回-1，有的话他会返回对应的下标
                alert("此账号未注册")
            }else{
                let index = teldata.indexOf(tel) // 返回对应手机号的下标   我们通过下标去判断密码
                if(pasdata[index] != pas){
                    alert("密码错误")
                }else{
                    console.log(iddata[index]);
                    // 定时器
                    setTimeout(function(){
                        // 跳转传餐  我先写一个传一个参数的例子吧   这个方法也可以传多个参数  你如果有需要的时候我再教你
                        window.location.href = "info.html?" + iddata[index]
                    },2000);
                    alert("登录成功,点击后跳转到首页")
                }
            }
        }
    }
</script>
</html>

